<script>
export default {
  name: 'MenuItem',
  functional: true,
  props: {
    icon: {
      type: String,
      default: () => ''
    },
    title: {
      type: String,
      default: () => ''
    }
  },
  render(h, context) {
    const { icon, title } = context.props;
    const vnodes = [];
    if (icon) {
      if (icon.includes('el-')) {
        vnodes.push(<i class={['menu-icon', icon]}></i>);
      }
      else {
        vnodes.push(<i class={['iconfont menu-icon', icon]}></i>);
      }
    }
    if (title) {
      vnodes.push(<span slot='title'>{title}</span>);
    }
    return vnodes;
  }
};
</script>
